<template>
  <div class="container">
    <el-row class="mb10">
      <el-col :span="16">
        <div class="flex">
          <el-input clearable v-model="data.searchParams.projectName" placeholder="项目名称"
            style="width: 130px; margin-right: 15px">
          </el-input>
          <SelectOption :options="options.projectnameList" :placeholder="'申报类型'" @change-value="changeValue">
          </SelectOption>
          <SelectOption :options="options.unitnameList" :placeholder="'申报奖项'" @change-value="changeValue1">
          </SelectOption>
          <el-date-picker v-model="data.searchParams.startTime" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
            placeholder="开始时间" style="width: 130px; margin-right: 15px"></el-date-picker>
          <el-date-picker v-model="data.searchParams.endTime" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
            style="width: 130px; margin-right: 15px" placeholder="结束时间"></el-date-picker>
          <el-button class="ordinary" @click="search()">搜索</el-button>
        </div>
      </el-col>
      <el-col :span="8" align="right">
        <el-button type="danger" @click="deleteList">批量删除</el-button>
        <el-button type="primary" @click="add">申报奖励</el-button>
      </el-col>
    </el-row>

    <div>
      <Table :tableArr="data.allTableData" :pagination="data.page.page" :columns="data.columns" :total="data.page.total"
        @delectTable="delectIds" @currentChange="currentChange">
        <template #operate="{ row }">
          <div v-if="row.status == '待提交'">
            <el-button size="small" class="ordinary" @click="handleEdit(row)">编辑</el-button>
            <el-button size="small" class="ordinary" @click="handletj(row)">提交</el-button>
          </div>
          <div v-if="row.status == '待审核'">
            <el-button size="small" class="ordinary" @click="handlesh(row)">审核</el-button>
          </div>
          <div v-if="row.status == '审批通过'">
            <el-button size="small" class="ordinary" @click="handlecx(row)">撤销</el-button>
          </div>
          <div v-if="row.status == '驳回'">
            <el-button size="small" class="ordinary" @click="handleEdit(row)">编辑</el-button>
            <el-button size="small" class="ordinary" @click="handletj(row)">提交</el-button>
          </div>
        </template>
      </Table>
    </div>

    <el-dialog v-model="data.dialogVisible" width="900px" :show-close="false" :close-on-click-modal="false">
      <template #title>
        <div class="my-header">
          <el-tabs v-model="activeName" class="demo-tabs">
            <el-tab-pane label="基本信息" name="first">
              <div v-if="data.dialogVisible">
                <Information ref="getAssociation" @valueFlag="valueFlag" :addFlag="data.addFlag" @awardType="awardType">
                </Information>
              </div>
            </el-tab-pane>
            <el-tab-pane label="附表信息" name="middle">
              <div v-if="data.awardSelect.sbjx == 1">
                <div v-if="data.awardSelect.sblx == 1">
                  <Schedule :fbData="data.awardSelect.pants" :users="data.users" :addFlag="data.addFlag"
                    @usersChange="usersChange" @paramsChange="paramsChange6"></Schedule>
                </div>
                <div v-else-if="data.awardSelect.sblx == 2">
                  <fmzl :fbData="data.awardSelect.patents" :addFlag="data.addFlag"></fmzl>
                </div>
                <div v-else-if="data.awardSelect.sblx == 3">
                  <jsjrjzz ref="getMiddle"  @valueFlag2="valueFlag2" :fbData="data.awardSelect.softwarecopyrights" :addFlag="data.addFlag"
                    @paramsChange="paramsChange2"></jsjrjzz>
                </div>
                <div v-else-if="data.awardSelect.sblx == 4">
                  <jsbz  ref="getMiddle" @valueFlag2="valueFlag2"  :fbData="data.awardSelect.technicalnorms" :addFlag="data.addFlag" @paramsChange="paramsChange1">
                  </jsbz>
                </div>
                <div v-else-if="data.awardSelect.sblx == 5">
                  <jsgf :fbData="data.awardSelect.technicalmethods" :addFlag="data.addFlag" @paramsChange="paramsChange">
                  </jsgf>
                </div>
                <div v-else-if="data.awardSelect.sblx == 6">
                  <xslz :fbData="data.awardSelect.composition" :addFlag="data.addFlag" @paramsChange="paramsChange5">
                  </xslz>
                </div>
                <div v-else-if="data.awardSelect.sblx == 7">
                  <xslw :fbData="data.awardSelect.thesis" :addFlag="data.addFlag" @paramsChange="paramsChange4"></xslw>
                </div>
              </div>
              <div v-else-if="data.awardSelect.sbjx == 2">
                <zdkjxmlxj :fbData="data.awardSelect.projects" :users="data.users" :addFlag="data.addFlag"
                  @usersChange="usersChange" @paramsChange="paramsChange8"></zdkjxmlxj>
              </div>
              <div v-else>
                <cxptjsj :fbData="data.awardSelect.innovate" :users="data.users" :addFlag="data.addFlag"
                  @usersChange="usersChange" @paramsChange="paramsChange9"></cxptjsj>
              </div>
            </el-tab-pane>
            <el-tab-pane label="附件信息" name="second">
              <platformFiles :files="data.fileList" @dataChange="dataChange" @filesParams="filesParams"></platformFiles>
            </el-tab-pane>
            <el-tab-pane label="变更记录" name="third" v-if="data.addFlag == 1">
              <record :changeLogs="data.changeLogs"></record>
            </el-tab-pane>

            <el-tab-pane label="流程中心" name="4">

              <!--
              <flowChart    processInstanceId="0f2e3e95-5608-11ee-896b-525400c6fca2" >

              </flowChart> -->

              <flowChart :processInstanceId="data.processInstanceId"></flowChart>


            </el-tab-pane>
          </el-tabs>
        </div>
      </template>

      <template #footer>
        <div class="dialog-footer" v-if="data.status == 0">
          <el-button @click="data.dialogVisible = false">关闭</el-button>
          <!-- <el-button type="primary">下载</el-button>
          <el-button type="primary">暂存</el-button> -->
          <el-button type="primary" @click="sure">保存</el-button>
        </div>
        <div class="dialog-footer" v-if="data.status == 1">
          <el-button @click="data.dialogVisible = false">关闭</el-button>
          <el-button type="primary" @click="handlebh">驳回</el-button>
          <el-button type="primary" @click="handletg">通过</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>
<script lang="js">
import flowChart from '@/components/PublicProcess/Chart/flowChart.vue'
import Api from '@/views/science/api/awards'
import platformFiles from '@/views/science/components/platformFiles/platformFiles.vue'
import record from '@/views/science/components/record/record.vue'
import SelectOption from '@/views/science/components/selectOption/index.vue'
import Table from '@/views/science/components/table/table.vue'
import { Modals, tips } from '@/views/science/components/tips/tips'
import { ElMessage } from 'element-plus'
import { computed, reactive, ref } from 'vue'
import { useStore } from 'vuex'
import cxptjsj from './cxptjsj.vue'
import fmzl from './fmzl.vue'
import Information from './information.vue'
import jsbz from './jsbz.vue'
import jsgf from './jsgf.vue'
import jsjrjzz from './jsjrjzz.vue'
import Schedule from './schedule.vue'
import xslw from './xslw.vue'
import xslz from './xslz.vue'
import zdkjxmlxj from './zdkjxmlxj.vue'


export default {
  components: {
    SelectOption,
    flowChart,
    Table,
    platformFiles,//附件
    Information,//基本信息
    Schedule,//科技奖项附表信息
    fmzl, //发明专利
    jsjrjzz, //计算机软件著作
    jsbz, //技术标准
    jsgf, //技术工法
    xslz, //学术论著
    xslw, //学术论文
    zdkjxmlxj, //重大科技项目立项奖
    cxptjsj, //创新平台建设奖
    record,//变更记录
  },
  setup() {
    const store = useStore()
    const startDate = ref(null);  // 开始时间绑定值
    const endDate = ref(null);  // 结束时间绑定值
    const activeName = ref('first')//tab切换
    let data = reactive({
      processInstanceId: '',
      currTaskTd:'',
      changeLogs: [],//变更记录
      addFlag: 0,
      flag: null,
      status: 0, //0编辑，1审核
      dialogVisible: false,//弹窗
      page: { page: 1, pageSize: 10, total: 0 },
      ids: [],
      searchParams: {

        projectName: '', // 项目名称
        applyClass: '',//申报类型
        awardApplyName: '', // 申报奖项
        startTime: '',
        endTime: '',
      },
      allTableData: [],
      columns: [
        {
          key: 'projectNo',
          width: 140,
          label: '项目编号',
        },
        {
          key: 'projectName',
          width: 140,
          label: '项目名称',
        },
        {
          key: 'applyClass',
          width: 140,
          label: '申报类型',
        },
        {
          key: 'awardApplyName',
          width: 140,
          label: '申报奖项',
        },
        {
          key: 'applyUnitName',
          width: 140,
          label: '申报单位',
        },
        {
          key: 'applyUser',
          width: 140,
          label: '申报人',
        },
        {
          key: 'status',
          width: 140,
          label: '状态',
          textColor: true
        },
      ],
      pants: [],
      users: [],
      fileList: [], //附件信息

      awardSelect: {
        sbjx: 1,
        sblx: 1,
        pants: {}, //附表信息-科技创新成果奖-科学奖项
        patents: {}, //附表信息-科技创新成果奖-发明专利
        softwarecopyrights: {}, //科技创新成果奖-软件著作权
        technicalnorms: {}, //科技创新成果奖-技术标准
        technicalmethods: {}, //科技创新成果奖-技术工法
        composition: {}, //科技创新成果奖-学术著作
        thesis: {}, //科技创新成果奖-学术论文
        projects: {}, //重大科技项目立项奖
        innovate: {}, //创新平台建设奖
      },
    })

    const loading = ref(true)//加载
    // 存储下拉框数组的对象
    const options = reactive({
      projectnameList: computed(() => store.state.technologyStrength.KJSL_DECLARATION_TYPE),
      unitnameList: computed(() => store.state.technologyStrength.KJSL_APPLYING_FOR_AWARDS1),
    })
    const changeValue = (item) => data.searchParams.applyClass = item.itemValue
    const changeValue1 = (item) => data.searchParams.awardApplyName = item.itemValue

    data.searchParams.page=data.page.page
    data.searchParams.pageSize=data.page.pageSize

    const getListData = () => { // 获取列表数据
      loading.value = true   // 加载
      Api.getTotalList(data.searchParams)
        .then((res) => { // 获取列表数据
          let resData = res.data.data // 获取列表数据
          resData.records.map((item) => {
            if (item.status == 0) {
              item.status = "待提交"
            } else if (item.status == 1) {
              item.status = "待审核"
            } else if (item.status == 2) {
              item.status = "审批通过"
            } else if (item.status == 3) {
              item.status = "驳回"
            }
          // formate: "YYYY-MM-DD HH:mm:ss",
            item.applyTime = new Date(item.applyTime).getFullYear() + `-` + (new Date(item.applyTime).getMonth() + 1) + `-` + new Date(item.applyTime).getDay()
          })
          data.allTableData = resData.records   // 获取列表数据
          data.page.total = resData.total   // 获取列表数据
        })
        .finally(() => { // 获取列表数据
          loading.value = false  // 获取列表数据
        })
    }

    //详情数据获取
    const detailData = async (id) => {
      Api.detailData({
        id: id
      })
        .then((res) => { // 获取列表数据
          const resData = res.data.data


          store.commit('technologyStrength/getachievementINFO', { ...resData.baseInfo })
          // store.commit('technologyStrength/getfbxxINFO', { ...resData.pants })
          data.users = res.data.data.users
          data.fileList = res.data.data.fileList

          data.changeLogs = res.data.data.changeLogs
          data.awardSelect.sbjx = resData.baseInfo.awardApplyId

          data.processInstanceId = resData.baseInfo.processInstanceId

          data.currTaskTd=resData.baseInfo.currTaskTd


          data.awardSelect.sblx = resData.baseInfo.applyClassId
          Object.assign(data.awardSelect, resData);
          data.addFlag = 1
          store.commit('technologyStrength/getAddFlag', 1)
          data.dialogVisible = true
        })
    }

    // 点击查询按键，分页设置为当前页为1，
    const search = () => {
      data.page.page = 1
      getListData()
    }

    // 删除
    const deleteList = () => {
      if (data.ids.length) {
        Modals('是否删除选择内容', '提示', 'warning').then(async () => {
          let res = await Api.deleteList({
            id: data.ids + ''
          })
          if (res.data.success) {
            tips('删除成功', 'success')
            getListData()
          }
        }).catch(() => {
          console.log("点击了取消")
        })
      } else {
        tips('请选择', 'warning')
      }
    }

    const valueFlag = (flag) => {
      data.flag = flag
    }

    const awardType = (awardSelect) => {
      console.log(awardSelect)
      Object.assign(data.awardSelect, awardSelect)
    }

    const paramsChange = (params) => {
      console.log(params)
      data.awardSelect.technicalmethods = params
    }

    const paramsChange1 = (params) => {
      console.log(params)
      data.awardSelect.technicalnorms = params
    }

    const paramsChange2 = (params) => {
      console.log(params)
      data.awardSelect.softwarecopyrights = params
    }

    const paramsChange4 = (params) => {
      console.log(params)
      data.awardSelect.thesis = params
    }

    const paramsChange5 = (params) => {
      console.log(params)
      data.awardSelect.composition = params
    }

    const paramsChange6 = (params) => {
      data.awardSelect.pants = params
    }

    const paramsChange8 = (params) => {
      console.log(params)
      data.awardSelect.projects = params
    }

    const paramsChange9 = (params) => {
      console.log(params)
      data.awardSelect.innovate = params
    }

    const delectIds = (ids) => {
      data.ids = ids
    }

    const currentChange = (current) => {
      data.searchParams.page = current
      getListData()
    }

    const dataChange = () => {//附件
      console.log(1)
    }

    const filesParams = (params) => {
      data.fileList = params
    }

    const usersChange = (params) => {
      data.users = params
    }

    //修改
    const handleEdit = (row) => {
      store.commit('technologyStrength/getRowId', row.id)
      detailData(row.id)
      data.status = 0
      activeName.value = 'first'
    }

    //提交
    const handletj = (row) => {



      Modals('是否提交本次内容', '提示', 'warning').then(async () => {

        let res = Api.startProcess({
          flowKey: 'reward',
          businessKey: row.id,
          businessType: 'YW01'
        })
          getListData()

        // if (res) {
        //   console.log(res)
        //   let ress = await Api.submit({
        //     id: row.id
        //   })
        //   if (ress.data.success) {
        //     tips('提交成功', 'success')
        //     getListData()
        //   }

        // }


      }).catch(() => {
        console.log("点击了取消")
      })
    }

    //审核
    const handlesh = (row) => {
      store.commit('technologyStrength/getRowId', row.id)
      data.status = 1
      activeName.value = 'first'
      detailData(row.id)
    }

    //驳回
    const handlebh = () => {
      Modals('是否驳回本次内容', '提示', 'warning').then(async () => {
        let res = await Api.auditNotPass({
          id: store.state.technologyStrength.rowId
        })
        if (res.data.success) {
          tips('驳回成功', 'success')
          getListData()
          data.dialogVisible = false
        }
      }).catch(() => {
        console.log("点击了取消")
      })
    }

    //通过
    const handletg = () => {

      const form = store.state.technologyStrength.achievementINFO



      Modals('是否通过本次内容', '提示', 'warning').then(async () => {
        let res = await Api.allowProcess({
           procInsId:data.currTaskTd,
           comment:form.unitRemark
        })
        if (res.data.success) {
          tips('成功通过', 'success')
          getListData()
          data.dialogVisible = false
        }
      }).catch(() => {
        console.log("点击了取消")
      })


      // Modals('是否通过本次内容', '提示', 'warning').then(async () => {
      //   let res = await Api.auditPass({
      //     id: store.state.technologyStrength.rowId
      //   })
      //   if (res.data.success) {
      //     tips('成功通过', 'success')
      //     getListData()
      //     data.dialogVisible = false
      //   }
      // }).catch(() => {
      //   console.log("点击了取消")
      // })
    }

    //撤销
    const handlecx = (row) => {
      Modals('是否撤销审核通过的内容', '提示', 'warning').then(async () => {
        let res = await Api.rollback({
          id: row.id
        })
        if (res.data.success) {
          tips('撤销成功', 'success')
          getListData()
        }
      }).catch(() => {
        console.log("点击了取消")
      })
    }

    const add = () => {
      store.commit('technologyStrength/getAddFlag', 0)
      data.addFlag = 0
      data.dialogVisible = true //弹窗
      data.status = 0
      activeName.value = 'first'
      data.awardSelect.sbjx = 1
      data.awardSelect.sblx = 1
      store.commit('technologyStrength/emptyachievementINFO')
    }

    const getAssociation = ref()
    const sure = async () => { // 确定
      const form = store.state.technologyStrength.achievementINFO
      getAssociation.value.submitForm()


      if (!data.flag) {
        ElMessage({
          message: '请将基本信息补充完整',
          type: 'warning',
        })
        return
      }

      let params;
      if (data.awardSelect.sbjx == 1) {
        if (data.awardSelect.sblx == 1) {
          params = {
            baseInfo: form,
            pants: data.awardSelect.pants,
            users: data.users,
            fileList: data.fileList
          }
        } else if (data.awardSelect.sblx == 2) {
          params = {
            baseInfo: form,
            patents: data.awardSelect.patents,
            fileList: data.fileList
          }
        } else if (data.awardSelect.sblx == 3) {
          params = {
            baseInfo: form,
            softwarecopyrights: data.awardSelect.softwarecopyrights,
            fileList: data.fileList
          }
        } else if (data.awardSelect.sblx == 4) {
          params = {
            baseInfo: form,
            technicalnorms: data.awardSelect.technicalnorms,
            fileList: data.fileList
          }
        } else if (data.awardSelect.sblx == 5) {
          params = {
            baseInfo: form,
            technicalmethods: data.awardSelect.technicalmethods,
            fileList: data.fileList
          }
        } else if (data.awardSelect.sblx == 6) {
          params = {
            baseInfo: form,
            composition: data.awardSelect.composition,
            fileList: data.fileList
          }
        } else if (data.awardSelect.sblx == 7) {
          params = {
            baseInfo: form,
            thesis: data.awardSelect.thesis,
            fileList: data.fileList
          }
        }
      } else if (data.awardSelect.sbjx == 2) {
        params = {
          baseInfo: form,
          projects: data.awardSelect.projects,
          users: data.users,
          fileList: data.fileList
        }
      } else if (data.awardSelect.sbjx == 3) {
        params = {
          baseInfo: form,
          innovate: data.awardSelect.innovate,
          fileList: data.fileList
        }
      }
      let res
      if (form.id) {
        res = await Api.edit(params)
      } else {
        res = await Api.insert(params)
      }
      if (res.data) {
        tips('保存成功', 'success')
        store.commit('technologyStrength/emptyachievementINFO')
        getListData()  // 获取列表数据
        activeName.value = 'first'
        data.dialogVisible = false  // 弹窗
      }
    }


    getListData()

    return {
      delectIds,
      changeValue,
      changeValue1,
      currentChange,
      search,
      filesParams,
      usersChange,

      valueFlag,
      awardType,
      paramsChange,
      paramsChange1,
      paramsChange2,
      paramsChange4,
      paramsChange5,
      paramsChange6,
      paramsChange8,
      paramsChange9,

      dataChange,
      getAssociation,
      activeName,
      options,
      data,

      handleEdit,
      handletj,
      handlesh,
      handlecx,
      handlebh,
      handletg,

      // 列表
      getListData,
      // 新增
      add,
      sure,
      deleteList,
      startDate,
      endDate,
    }
  },
}
</script>
<style lang="scss" scoped>
.container {
  background-color: white;
  padding: 20px;
}

:global(.el-dialog__body) {
  padding: 0;
}

.el-col {
  line-height: 40px;
}

.el-form-item {
  .el-input {
    width: 100px;
    background-color: aliceblue;
  }

  .el-select {
    width: 100px;
  }
}

.custom-color {
  color: red !important;
  /* 确保优先级高于其他样式 */
}

.el-table th {
  background-color: #f0f0f0;
  /* 修改表头背景色 */
  color: #333;
  /* 修改表头文字颜色 */
}

/* .demo-tabs > .el-tabs__content {
  padding: 32px;
  color: #6b778c;
  font-size: 32px;
  font-weight: 600;
} */

.open-title {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
}

/deep/.el-dialog__body {
  display: block !important;
}

.mt15 {
  margin-top: 15px;
}

.mb10 {
  margin-bottom: 10px;
}

.tc {
  text-align: center;
}

.align-center {
  align-items: center;
}

.space-between {
  justify-content: space-between;
}

.mt20 {
  margin-top: 20px;
}

.flex {
  display: flex;
}
</style>
